<template>
  <div class="editheader_main_panel">
    <div class="editheader_main_panel_content">
      <van-uploader
        v-model="fileList"
        :max-size="800 * 800"
        @oversize="onOversize"
        :after-read="afterRead"
        :before-read="beforeRead"
      />
    </div>
    <div class="editheader_main_panel_bottom">
      <BottomTools
        @cancelHandle="cancelClickHandle"
        @enterHandle="saveClickHandle"
        :type="type"
      ></BottomTools>
    </div>
  </div>
</template>
<script>
export default {
  name: "EditHeaderMain",
  data() {
    return {
      fileList: [],
      type: 2,
    };
  },
  components: {
    BottomTools: () =>
      import(
        /* webpackChunkName:"bottomTools" */ "../../components/common/bottomTools.vue"
      ),
  },
  methods: {
    onOversize() {},
    async afterRead(file) {
      console.log(file, this.fileList);
      /* let uploadImg = await this.$uploaderImg(file.file);
      console.log(uploadImg); */
    },
    beforeRead(file) {
      if (file.type !== "image/jpeg" && file.type !== "image/png") {
        Toast({ message: "只允许上传jpg/png格式的图片！", position: "bottom" });
        return false;
      }
      return true;
    },
    cancelClickHandle() {
      this.$router.go(-1);
    },
    saveClickHandle() {},
  },
};
</script>
<style lang="less">
@base: 23.44rem;
.editheader_main_panel {
  margin: 100 / @base 0 0;
  .editheader_main_panel_content {
    min-height: 200 / @base;
  }
  .editheader_main_panel_bottom {
    margin: 30 / @base 10 / @base;
  }
}
</style>
